<template>
    <div>
        <mt-header fixed title="知识档案" id="header2"></mt-header>
          <div class="dangan">档案查询</div>
          <el-form ref="form" :model="form" label-width="80px" id="renwu">
            <el-form-item label="任务系列号">
              <el-input v-model="form.name" placeholder="任务系列号"></el-input>
            </el-form-item>
            <el-form-item label="任务类型">
              <el-select v-model="query1">
                <el-option label="全部" value="all"></el-option>
                <el-option label="巡检" value="xunjian"></el-option>
                <el-option label="维修" value="weixiu"></el-option>
                <el-option label="维护" value="weihu"></el-option>
                <el-option label="应急" value="yingji"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="雷达站">
              <el-select v-model="query2">
                <el-option label="全部" value="all"></el-option>
                <el-option label="巡检" value="xunjian"></el-option>
                <el-option label="维修" value="weixiu"></el-option>
                <el-option label="维护" value="weihu"></el-option>
                <el-option label="应急" value="yingji"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="海事局">
               <el-select v-model="query3">
                  <el-option label="全部" value="all"></el-option>
                  <el-option label="湛江海事局" value="zhanjiang"></el-option>
                  <el-option label="广州海事局" value="guangzhou"></el-option>
                  <el-option label="汕头海事局" value="shantou"></el-option>
                  <el-option label="茂名海事局" value="maoming"></el-option>
                  <el-option label="惠州海事局" value="huizhou"></el-option>
                  <el-option label="珠海海事局" value="zhuhai"></el-option>
                  <el-option label="东莞海事局" value="dongguan"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="任务类型">
              <el-select v-model="query4">
                <el-option label="全部" value="all"></el-option>
                <el-option label="巡检" value="xunjian"></el-option>
                <el-option label="维修" value="weixiu"></el-option>
                <el-option label="维护" value="weihu"></el-option>
                <el-option label="应急" value="yingji"></el-option>
              </el-select>
            </el-form-item>
             <el-form-item label="实施时间">
                <el-col>
                  <el-date-picker type="date" placeholder="yy-mm-dd" v-model="form.date1" style="width: 80%;"></el-date-picker>
                </el-col>
                <el-col>
                  <el-date-picker type="date" placeholder="yy-mm-dd" v-model="form.date2" style="width: 80%;"></el-date-picker>
                </el-col>
              </el-form-item>
              <el-form-item id="el_form">
                <el-button type="primary">查询</el-button>
              </el-form-item>
          </el-form>
          <!-- 档案列表  结果 -->
          <div class="task">
              <p>档案列表</p>
              <el-collapse>
                <el-collapse-item title="惠州VTS中心" name="1">
                  <div>海事局 :惠州海事局</div>
                  <div>任务状态:实施中</div>
                  <div>审核状态:待审核</div>
                  <div>任务系列号:20180622005</div>
                  <div>工作报告:巡检报告</div>
                </el-collapse-item>
              </el-collapse>
          </div>
          <!-- 知识库管理 -->
          <div class="dangan">知识库管理</div>
          <el-form ref="form" :model="form" label-width="80px" id="renwu">
            <el-form-item label="上传人">
              <el-input v-model="form.name" placeholder="上传人"></el-input>
            </el-form-item>
            <el-form-item label="文件类型">
              <el-select v-model="query1">
                <el-option label="全部" value="all"></el-option>
                <el-option label="PNG" value="xunjian"></el-option>
                <el-option label="DOCX" value="weixiu"></el-option>
                <el-option label="TXT" value="weihu"></el-option>
                <el-option label="XLS" value="yingji"></el-option>
                <el-option label="其他" value="yingji"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="上传时间">
                <el-col >
                  <el-date-picker type="date" placeholder="yy-mm-dd" v-model="form.date1" style="width: 80%;"></el-date-picker>
                </el-col>
                <el-col>
                  <el-date-picker type="date" placeholder="yy-mm-dd" v-model="form.date2" style="width: 80%;"></el-date-picker>
                </el-col>
              </el-form-item>
              <el-form-item id="el_form">
                <el-button type="primary">查询</el-button>
                <el-button type="primary">新增</el-button>
              </el-form-item>
          </el-form>
           <!-- 知识库管理  结果 -->
          <div class="task">
              <p>知识库列表</p>
              <el-collapse>
                <el-collapse-item title="惠州VTS中心" name="1">
                  <div>海事局 :惠州海事局</div>
                  <div>任务状态:实施中</div>
                  <div>审核状态:待审核</div>
                  <div>任务系列号:20180622005</div>
                  <div>工作报告:巡检报告</div>
                </el-collapse-item>
              </el-collapse>
          </div>
          <!-- 知识库搜索 -->
          <div class="dangan">知识库搜索</div>
          <el-form ref="form" :model="form" label-width="80px" id="renwu">
            <el-form-item id="search">
              <el-input v-model="form.name" placeholder="知识库搜索"></el-input>
              <el-button type="primary">搜索</el-button>
            </el-form-item>
          </el-form>
           <div class="task">
              <p>搜索结果</p>
              <el-collapse>
                <el-collapse-item title="惠州VTS中心" name="1">
                  <div>海事局 :惠州海事局</div>
                  <div>任务状态:实施中</div>
                  <div>审核状态:待审核</div>
                  <div>任务系列号:20180622005</div>
                  <div>工作报告:巡检报告</div>
                </el-collapse-item>
              </el-collapse>
          </div>
    </div>
</template>
<script>
export default {
    data(){
    return{
      checked: 'workList',
      activeName: 'second',
      isActive:true,
    //默认选中第一项
      selected:"index",
      tableData:[
          {
            name:"广东省",
            state:"正常",
            report:"-"
          }
      ],
    tableList:[
        {
          name:"湛江海事局",
          state:"正常",
          report:"暂无"
        },
       {
          name:"茂名海事局",
          state:"正常",
          report:"暂无"
        },
        {
          name:"惠州海事局",
          state:"正常",
          report:"暂无"
        },
        {
          name:"珠海海事局",
          state:"正常",
          report:"暂无"
        },
        {
          name:"东莞海事局",
          state:"正常",
          report:"暂无"
        }
    ],
    zhanjiangList:[
        {
          name:"海湾大桥雷达站",
          state:"正常",
          report:"巡检报告"
        },
        {
          name:"洲岛雷达站",
          state:"正常",
          report:"巡检报告"
        },
        {
          name:"山狗吼雷达站",
          state:"正常",
          report:"巡检报告"
        },
        {
          name:"三塘角雷达站",
          state:"正常",
          report:"巡检报告"
        }
    ],
    // 获取row的key值
    getRowKeys(row) {
      return row.id;
    },
    // 要展开的行，数值的元素是row的key值
    expands: [],
    form: {
      name: '',
      region: '',
      date1: '',
      date2: '',
      delivery: false,
      type: [],
      resource: '',
      desc: ''
    },
    query1:'all',
    query2:'all',
    query3:'all',
    query4:'all',
    query5:'all'

    }
  },
  mounted() {
    // 在这里你想初始化的时候展开哪一行都可以了
    this.expands.push(this.tableList[1].id);
  },
  methods:{
    handleToggleDrawer() {
      this.$refs.drawerLayout.toggle();
    },
    toIndex(){
      this.$router.push('/index');
    }
  }
}
</script>
<style scoped lang="scss">

  .task{ 
    width:90vw;
    margin:0 auto 20px;
     p{
      margin-top:5vw;
      line-height:10vw;
      color:#777676;
      font-size:14px;
    }
  }
 
  .dangan{
    width:95vw;
    height:40px;
    line-height:40px;
    padding-left:5vw;
    margin-top:2.5rem;
    color:#1b3464;
    font-weight:700;
  }
  #renwu{
    width:90vw;
    margin:auto;
  }

</style>
